<template>
    <div class="form">
        <user-form :style="{ marginRight: 0 }" @change="changeHandler" />
        <button @click="toInfo">提交信息</button>
    </div>
</template>


<script lang="ts" setup>
import { ref } from 'vue';
import { UserForm } from '../card/components';
import { IUserInfo } from "@/types";
import { useRouter } from 'vue-router';

const $router = useRouter();

const userInfo = ref<Partial<Omit<IUserInfo, "education">>>({});

const changeHandler = (e: IUserInfo) => {
    Object.assign(userInfo.value,e)
}

const toInfo = ()=>{
 $router.push({
    name: "info",
    params: {from: "from"},
    query: {userDetail: JSON.stringify(userInfo.value)}
 })
}
</script>


<style lang="less" scoped>
@import "./form.less";
</style>